import Link from 'next/link'

export default function Knowledge() {
  return (
    <main className="min-h-screen bg-gradient-to-b from-blue-50 to-white">
      {/* 导航栏 */}
      <nav className="bg-white shadow-md">
        <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
          <div className="flex justify-between h-16">
            <div className="flex">
              <div className="flex-shrink-0 flex items-center">
                <h1 className="text-2xl font-bold text-blue-600">坐骨神经痛助手</h1>
              </div>
              <div className="hidden sm:ml-6 sm:flex sm:space-x-8">
                <Link href="/" className="border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">
                  首页
                </Link>
                <Link href="/knowledge" className="border-blue-500 text-gray-900 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">
                  知识库
                </Link>
                <Link href="/ai-chat" className="border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">
                  AI 对话
                </Link>
                <Link href="/exercises" className="border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 inline-flex items-center px-1 pt-1 border-b-2 text-sm font-medium">
                  锻炼建议
                </Link>
              </div>
            </div>
          </div>
        </div>
      </nav>

      {/* 主要内容 */}
      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
        <div className="text-center mb-12">
          <h2 className="text-3xl font-extrabold text-gray-900 sm:text-4xl">
            医学知识与营养建议
          </h2>
          <p className="mt-3 max-w-2xl mx-auto text-xl text-gray-500 sm:mt-4">
            了解坐骨神经痛的相关医学知识和营养建议
          </p>
        </div>

        <div className="grid grid-cols-1 md:grid-cols-2 gap-8">
          {/* 医学知识 */}
          <div className="bg-white rounded-lg shadow-lg overflow-hidden">
            <div className="p-6">
              <h3 className="text-2xl font-bold text-gray-900 mb-4">医学知识</h3>
              
              <div className="space-y-6">
                <div>
                  <h4 className="text-lg font-semibold text-gray-900 mb-2">什么是坐骨神经痛？</h4>
                  <p className="text-gray-600">
                    坐骨神经痛是指沿着坐骨神经路径出现的疼痛、麻木或刺痛感。坐骨神经是人体最长的神经，从下背部延伸到腿部。
                  </p>
                </div>

                <div>
                  <h4 className="text-lg font-semibold text-gray-900 mb-2">常见症状</h4>
                  <ul className="list-disc list-inside text-gray-600 space-y-1">
                    <li>下背部疼痛</li>
                    <li>臀部疼痛</li>
                    <li>腿部疼痛、麻木或刺痛</li>
                    <li>行走困难</li>
                    <li>站立或坐着时疼痛加重</li>
                  </ul>
                </div>

                <div>
                  <h4 className="text-lg font-semibold text-gray-900 mb-2">常见原因</h4>
                  <ul className="list-disc list-inside text-gray-600 space-y-1">
                    <li>腰椎间盘突出</li>
                    <li>脊柱狭窄</li>
                    <li>脊椎滑脱</li>
                    <li>肌肉紧张或损伤</li>
                    <li>长时间保持不良姿势</li>
                  </ul>
                </div>
              </div>
            </div>
          </div>

          {/* 营养建议 */}
          <div className="bg-white rounded-lg shadow-lg overflow-hidden">
            <div className="p-6">
              <h3 className="text-2xl font-bold text-gray-900 mb-4">营养建议</h3>
              
              <div className="space-y-6">
                <div>
                  <h4 className="text-lg font-semibold text-gray-900 mb-2">推荐食物</h4>
                  <ul className="list-disc list-inside text-gray-600 space-y-1">
                    <li>富含 omega-3 的鱼类（三文鱼、沙丁鱼等）</li>
                    <li>深色蔬菜（菠菜、羽衣甘蓝等）</li>
                    <li>坚果（核桃、杏仁等）</li>
                    <li>全谷物</li>
                    <li>水果（蓝莓、樱桃等）</li>
                  </ul>
                </div>

                <div>
                  <h4 className="text-lg font-semibold text-gray-900 mb-2">饮食注意事项</h4>
                  <ul className="list-disc list-inside text-gray-600 space-y-1">
                    <li>保持健康的体重</li>
                    <li>多喝水，保持水分</li>
                    <li>限制加工食品的摄入</li>
                    <li>减少糖和盐的摄入</li>
                    <li>避免过量饮酒</li>
                  </ul>
                </div>

                <div>
                  <h4 className="text-lg font-semibold text-gray-900 mb-2">补充建议</h4>
                  <ul className="list-disc list-inside text-gray-600 space-y-1">
                    <li>维生素 D</li>
                    <li>维生素 B12</li>
                    <li>镁</li>
                    <li>钙</li>
                    <li>姜黄素</li>
                  </ul>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </main>
  )
} 